const {src , dest, parallel} = require('gulp')
const cleancss = require('gulp-clean-css')
const rename = require('gulp-rename')
const htmlmin = require('gulp-htmlmin')
const browserSync = require('browser-sync')
const bs = browserSync.create()

const style = () => {
    return src('css/index.css', {base: 'css'})
    .pipe(cleancss())
    .pipe(rename({
        "extname": ".min.css"
    }))
    .pipe(dest('dist/css'))

}

const js = () => {
    return src('js/*' , {base: 'js'})
    .pipe(dest('dist/js'))
}

const html = () => {
    return src('./index1.html')
    .pipe(htmlmin({
        collapseWhitespace: true,
        minifyCss: true,
        minifyJs: true
    }))
    .pipe(rename({
        "basename": "index",
    }))
    .pipe(dest('dist'))

}
const serve = () => {
    bs.init({
        server:{
            baseDir: './dist'
        }
    })
}
const build = parallel(style , js , html)
module.exports = {
    build,
    serve
}